<route lang="json5">
{
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: '意见反馈',
  },
}
</route>

<template>
  <view>
    <!--  #ifdef MP-WEIXIN -->
    <view class="py-22rpx font-size-24rpx w-center text-center color-orange">此投诉为本小程序自有投诉渠道，非微信官方投诉渠道</view>
    <!--  #endif -->
    
    <!--  #ifdef H5 -->
    <view class="w-full h-50rpx"></view>
    <!--  #endif -->

    <!-- 标题 -->
    <base-title text="意见反馈" wrapClass="pb-22rpx" />

    <view class="w-572rpx m-a">
      <wd-textarea v-model="feedback" placeholder="请提出您的宝贵意见" />
    </view>
    
    <!-- 提交 -->
    <view class="btn-full w-center pt-30rpx">
      <wd-button 
        class="btn-w-full btn-h-78"
        :loading="loading"
        @click="userFeedbackInfo"
      >提交</wd-button>
    </view>
  </view>
</template>
  
<script lang="ts" setup>
import BaseTitle from "@/components/base/base-title.vue";
import { UserFeedbackInfo } from "@/service/db_user";
import { useThemeStore, useUserStore } from "@/store";
import { useMessage, useToast } from "wot-design-uni";

// 主题颜色
const { themeConfig } = useThemeStore();
const user = useUserStore();
const toast = useToast();
const message = useMessage();

const loading = ref(false);
const feedback = ref('');
const userFeedbackInfoConfirm = () => {
  message
    .confirm({
      msg: `此投诉为本小程序自有投诉渠道，非微信官方投诉渠道`,
      title: '反馈提示'
    })
    .then(() => {
      userFeedbackInfo();
    })
    .catch(() => {
      console.log('点击了取消按钮')
    })
}
const userFeedbackInfo = async() => {
  try {
    if (!feedback.value) return toast.show('请输入意见反馈！');
    loading.value = true;
    const res = await UserFeedbackInfo({
      userId: user.userInfo.id,
      description: feedback.value,
    })
    loading.value = false;
    if (res.code != 200) return toast.show(res.message);
    toast.show('提交成功, 感谢您的反馈！');
    feedback.value = '';
  } catch (error) {
    loading.value = false;
    console.log(error);
  }
}

onShow(() => {
  nextTick(() => {
    // 设置页面标题
    themeConfig.title = '意见反馈';
  })
})
</script>

<style lang="scss" scoped>
</style>
        